<!DOCTYPE html>
<html>
<title>图片选择</title>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,maximun-scale=1,mininum-scsle=1,user-scale=1">
    <title>file chooser</title>
    <style>
        .filechooser {
            width: 95%;
            height: 50px;
            -webkit-background-clip: border-box;

        }
    </style>
    <script>
        var display = function () {
            var path = document.getElementById("file_chooser").textContent;
            document.getElementById("filechooser_display").innerHTML("<b>" + path + "</b>");
        }
    </script>
</head>
<body>
<ul class="listview">
    通过accept限定格式类型,移动端不支持multiple属性
    <br/>
    <fieldset class="itemset">
        <input class="filechooser" id="file_chooser" type="file" accept="image/*" placeholder="file path"
               onchange="display()" oninput="display()"><br>
        <p id="filechooser_display"></p>
        <div class="line_black"></div>

    </fieldset>

</ul>

</body>

</html>